// 立即执行匿名函数
// 添加任务
// 展示任务
// 修改状态
// 删除
// 代码逻辑
// 数据部分：增、删除、修改=>函数
// 页面渲染部分
import TodoData from './src/TodoData'
;import TodoDom from './src/TodoDom';
((document)=>{
    const oAddInput:HTMLInputElement = document.querySelector('.todo-add-ipt')
    const oAddBtn:HTMLButtonElement = document.querySelector('.todo-add-btn')
    const oListWrapper:HTMLButtonElement = document.querySelector('.todo-list')
    // 数据的处理
    // 数据初始化
     // 数据初始化
     const TodoDataList:TodoData = new TodoData([
        {
            id: 1,
            content: 'test',
            completed: false
        }
    ], oListWrapper)

    
    function init():void {
       
        // 视图初始化
        // 事件处理
        handleEvent()

    }
    function handleEvent():void {
        oAddBtn.addEventListener('click', addClick, false)
        oListWrapper.addEventListener('click', listClick, false)
    }

    function addClick():void {
        // 点击了添加按钮
        const val:string = oAddInput.value.trim()
        if(val.length > 0) {
            // 处理数据
            let res = TodoDataList.addTodoData({
                id: TodoDataList.todoList.length + 1,
                content: val,
                completed: false
            })
            if(res === 0) {
                alert('此项已存在')
            } else {
                // 数据是合法的，那么就应该去渲染页面
                TodoDataList.addDom({
                    id: TodoDataList.todoList.length,
                    content: val,
                    completed: false
                })
            }
        }
    }
    function listClick(e: MouseEvent):void{
        const target = e.target as HTMLElement
        // 点了input还是点了button
        const tagName = target.tagName 

        const id = Number(target.dataset.id)
        switch (tagName) {
            case 'INPUT':
                // 修改任务的状态
                // 数据修改
                TodoDataList.changeTodoData(id, target)
                // 视图修改
                break;
            case 'BUTTON': 
                // 删除任务
                break
            default:
                break
        }
    }
    init()
})(document)